<template>
  <div class="">
    <div class="lease_search">
      <!-- <div class="search_header">
        <span>搜索</span> -->

      <el-drawer title="新增" :visible.sync="drawer" :direction="direction">
        <el-form
          :label-position="labelPosition"
          label-width="80px"
          :model="formLabelAlign"
        >
          <el-form-item label="编号">
            <el-input v-model="formLabelAlign.name"></el-input>
          </el-form-item>
          <el-form-item label="名称">
            <el-input v-model="formLabelAlign.region"></el-input>
          </el-form-item>
          <el-form-item label="分属">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
          <el-form-item label="来源">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
          <el-form-item label="单价">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
          <el-form-item label="数量">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
          <el-form-item label="购入时间">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
          <el-form-item label="总价">
            <el-input v-model="formLabelAlign.type"></el-input>
          </el-form-item>
        </el-form>
        <el-button type="success">保存</el-button>
        <el-button type="primary">关闭</el-button>
      </el-drawer>
    </div>
    <div class="search_content">
      <!-- <a v-for="(item, index) in search_content" :key="index">
        <label for="">{{ item.name }}</label>
        <input type="text" />
      </a> -->
      <!-- <el-label name="编号">编号</el-label> -->
      编号: <el-input v-model="clientId" placeholder="请输入内容" size="mini"></el-input>
      花卉名称: <el-input v-model="clientName" placeholder="请输入内容" size="mini"></el-input>
      客户: <el-input v-model="input" placeholder="请输入内容" size="mini"></el-input>
      <el-button class="search_btn" @click="search">搜索</el-button>
      <el-button
        @click="drawer = true"
        type="primary"
        style="margin-left: 16px;"
        class="fr add_btn"
        size="mini"
      >
        新增
      </el-button>
    </div>
    <!-- </div> -->
  </div>
</template>

<script>
export default {
  data () {
    return {
      // search_content: [
      //   {
      //     name: '编号'
      //   },
      //   {
      //     name: '花卉名称'
      //   },
      //   {
      //     name: '客户'
      //   }
      // ],
      input: '',
      direction: 'rtl',
      drawer: false,
      labelPosition: 'left',
      formLabelAlign: {
        name: '',
        region: '',
        type: ''
      }
    }
  },
  method: {
    handleClose (done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done()
        })
        .catch(_ => {})
    }
  },
  component: {}
}
</script>

<style scoped>
@import "../assets/css/reset.css";
.lease_search {
  width:100%;
  margin: 0 auto;
  }
.search_header,
.search_content {
  width: 1200px;
  margin: 0 auto;
  /* margin-left:100px; */
  height: 30px;
  background-color: #e4e4e4;
  line-height: 28px;
}
.search_header span {
  padding: 0 20px;
}
.search_header .add_btn {
  margin-right: 10px;
  display: inline-block;
  /* border: 1px solid rebeccapurple; */
  /* background-color: #fff; */
}

.search_content {
  height: 50px;
  background-color: #fff;
}
.el-input {
  width: 200px;
  display: inline-block;
}
.search_content a {
  line-height: 50px;
  padding: 0 30px;
}
.search_btn {
  /* background-color: skyblue; */
  margin-left: 50px;
  font-size: 16px;
}
.search_btn:hover {
  background-color: #66cccc;
}
.el-form-item {
  margin: 10px 0;
}
.el-button {
  margin: 0 50px;
}
</style>
